<!DOCTYPE html>
<html lang="en">

	<head>
		<title>Contact</title>

		<!-- Meta tag Keywords -->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta charset="utf-8">
		<meta name="keywords" content="" />
		<script type="application/x-javascript">
			addEventListener("load", function() {
				setTimeout(hideURLbar, 0);
			}, false);

			function hideURLbar() {
				window.scrollTo(0, 1);
			}
		</script>
		<!--// Meta tag Keywords -->

		<!-- css files -->
		<link rel="stylesheet" href="css/bootstrap.css">
		<!-- Bootstrap-Core-CSS -->
		<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
		<!-- Style-CSS -->
		<link rel="stylesheet" href="css/font-awesome.css">
		<!-- Font-Awesome-Icons-CSS -->
		<!-- //css files -->

		<!-- web-fonts -->
		<link href="http://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&amp;subset=latin-ext" rel="stylesheet">
		<!-- //web-fonts -->

	</head>

	<body>

		<!--Header-->
		<header>
			<div class="container agile-banner_nav">
				<div class="row header-top">
					<div class="col-md-5 top-left p-0">
						<p><i class="fa fa-phone" aria-hidden="true"></i> Call us : 17866631279 </p>
					</div>
					<div class="col-md-7 top-right p-0">
						<p><i class="fa fa-map-marker" aria-hidden="true"></i>  青岛,崂山区
					</div>
				</div>
				<nav class="navbar navbar-expand-lg navbar-light bg-light">
					<h1 style="position: absolute;top:25px;"><a class="navbar-brand" href="index.html">旅心</a></h1>
					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
					<div class="collapse navbar-collapse justify-content-center" id="navbarSupportedContent">
						<ul class="navbar-nav ml-auto" style="position:absolute; top:20px;right: 20px;">
							<li class="nav-item active"> <a class="nav-link" href="index.html">主页 <span class="sr-only">(current)</span></a> </li>
							<li class="nav-item"> <a class="nav-link" href="about.html">关于</a> </li>
							<li class="nav-item"> <a class="nav-link" href="services.html">服务</a> </li>
							<li class="dropdown nav-item"> <a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">分类 <b class="caret"></b> </a>
								<ul class="dropdown-menu agile_short_dropdown">
									<li>
										<a href="pricing.html">定价计划</a>
									</li>
									<li>
										<a href="choice.html">路线选择</a>
									</li>
									<li>
										<a href="choice.html">预定机票</a>
									</li>
									<li>
										<a href="choice.html">预定酒店</a>
									</li>
									<li>
										<a href="choice.html">周边商品推荐</a>
									</li>
								</ul>
							</li>
							<li class="nav-item">
								<a class="nav-link" href="projects.html">推介</a>
							</li>
							<li class="nav-item pr-lg-0">
								<a class="nav-link pr-lg-0" href="contact.html">联系</a>
							</li>
						</ul>
					</div>

				</nav>
			</div>
		</header>
		<!--Header-->

		<!-- inner page banner -->
		<div class="innerpage-banner">
			<div class="layer1">
			</div>
		</div>
		<!-- //inner page banner -->

		<!-- contact -->
		<section class="w3ls-section contact py-5">
			<div class="container py-sm-3">
				<div class="w3ls-title">
					<h2 class="heading text-center mb-sm-5 mb-4">联系</h2>
				</div>
				<div class="w3ls_map">
					<iframe src="map2.html" frameborder="0" scrolling="no"></iframe>
				</div>

				<div class="row contact_wthreerow agileits-w3layouts">

					<div class="col-lg-5 col-md-6 agileits_w3layouts_contact_gridl">
						<div class="agileits_mail_grid_right_grid">
							<h4>联系地址</h4>
							<p>中国山东省，青岛市，崂山区</p>
							<ul class="contact_info">
								<li><span class="fa fa-map-marker" aria-hidden="true"></span>山东省，青岛市，崂山区<span class="left"> 中国</span>.</li>
								<li><span class="fa fa-envelope" aria-hidden="true"></span>
									<a href="mailto:info@example.com">info@example.com</a>
								</li>
								<li><span class="fa fa-phone" aria-hidden="true"></span>+17866631279</li>
								<li><span class="fa fa-globe" aria-hidden="true"></span>
									<a href="#">llnxx666@126.com</a>
								</li>
							</ul>
						</div>
					</div>
					<div class="col-lg-7 col-md-6 mt-md-0 mt-5 w3l_contact_form">
						<h4>联系方式</h4>
						<form action="#" method="post">
							<input type="text" name="Name" value="姓名" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Name';}" required="">
							<input type="email" name="Email" value="邮箱" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email';}" required="">
							<input type="text" name="Phone" value="电话" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Phone';}" required="">
							<textarea name="Message" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = '描述内容...';}" required="">描述内容...</textarea>
							<input type="submit" id="bt" value="提交">


						</form>
					</div>
				</div>
			</div>
		</section>

		<script type="text/javascript">
			window.onload=function(){
				var bt=document.getElementById("bt");
				bt.onclick=function(){
					if(confirm("是否提交")){
						alert("提交成功！");
					}
					else{
						alert("点击了取消按钮");
					}
				}
			}
		</script>
		<!-- //contact -->

		<!-- footer -->
		<footer class="py-5">
			<div class="container py-md-3">
				<div class="row footer-grids pb-md-5 pb-3">
					<div class="col-md-3 col-sm-6 col-6">
						<a href="#"> <i class="fa fa-phone"></i>电话</a>
					</div>
					<div class="col-md-3 col-sm-6 col-6">
						<a href="#"> <i class="fa fa-envelope"></i>邮件</a>
					</div>
					<div class="col-md-3 col-sm-6 col-6 mt-md-0 mt-2">
						<a href="#"> <i class="fa fa-qq"></i>QQ</a>
					</div>
					<div class="col-md-3 col-sm-6 col-6 mt-md-0 mt-2">
						<a href="#"> <i class="fa fa-comment"></i>在线咨询</a>
					</div>
				</div>

				<div class="subscribe-grid text-center">
					<p class="para three mt-4">旅心团队 </p>
					<h5>订阅我们的最新消息</h5>
					<p>预定
						<span>九折</span> 优惠</p>
					<form action="#" method="post">
						<input class="form-control" type="email" placeholder="预定" name="预定" required="">
						<button class="btn1">
					<i class="fa fa-paper-plane"></i>
				</button>
					</form>
				</div>
			</div>
		</footer>
		<!-- //footer -->

		<!-- copyright -->
		<section class="copyright py-4 text-center">
			<div class="container">
				<p>Copyright &copy; 2021 LNX All rights reserved.
				</p>
			</div>
		</section>
		<!-- //copyright -->

		<!-- js-scripts -->

		<!-- js -->
		<script type="text/javascript" src="js/jquery-2.2.3.min.js"></script>
		<script type="text/javascript" src="js/bootstrap.js"></script>
		<!-- Necessary-JavaScript-File-For-Bootstrap -->
		<!-- //js -->

		<!-- start-smoth-scrolling -->
		<script src="js/SmoothScroll.min.js"></script>
		<script type="text/javascript" src="js/move-top.js"></script>
		<script type="text/javascript" src="js/easing.js"></script>
		<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event) {
					event.preventDefault();
					$('html,body').animate({
						scrollTop: $(this.hash).offset().top
					}, 1000);
				});
			});
		</script>
		<!-- here stars scrolling icon -->
		<script type="text/javascript">
			$(document).ready(function() {
				/*
					var defaults = {
					containerID: 'toTop', // fading element id
					containerHoverID: 'toTopHover', // fading element hover id
					scrollSpeed: 1200,
					easingType: 'linear' 
					};
				*/

				$().UItoTop({
					easingType: 'easeOutQuart'
				});

			});
		</script>
		<!-- //here ends scrolling icon -->
		<!-- start-smoth-scrolling -->

		<!-- //js-scripts -->

	</body>

</html>